<template>
  <div class="ivu-mt-16">
    <div>
      <Row style="padding-bottom: 16px">
        <Col span="3">
          <Upload
            class="ivu-inline-block"
            :action="url"
            multiple
            :data="datas"
            name="files"
            :format="['jpg', 'jpeg', 'png']"
            accept=".jpg,.jpeg,.png"
            :show-upload-list="false"
            :before-upload="beforUpload"
            :on-success="successUpload"
          >
            <Button type="primary">上传图片</Button>
          </Upload>
        </Col>
        <Col
          span="21"
          v-if="listParams"
          style="overflow: auto; white-space: nowrap"
        >
          <template>
            <span class="ivu-mr-8" style="color: #666; font-size: 14px"
              >核验病种</span
            >
            <template v-for="item in disList">
              <template v-if="item.children.length > 0">
                <template v-for="ele in item.children">
                  <Button
                    v-if="ele.status == 1"
                    class="ivu-ml-8"
                    @click="handleDis(ele.value)"
                    :disabled="btnloading"
                    >{{ ele.label }}</Button
                  >
                </template>
              </template>
              <template v-else>
                <Button
                  v-if="item.status == 1"
                  class="ivu-ml-8"
                  @click="handleDis(item.value)"
                  :disabled="btnloading"
                  >{{ item.label }}</Button
                >
              </template>
            </template>
          </template>
        </Col>
        <!-- <Col span="3" v-if="userList&&userList.length>0" style="text-align:right;">
              <Button type="primary" @click="nextPatient" :disabled="edit">下一个</Button>
            </Col> -->
      </Row>
      <Scroll
        :on-reach-bottom="handleReachBottom"
        :height="viewHeight"
        :distance-to-edge="[1, 1]"
      >
        <waterfall
          :imgList="imgList"
          :name1="name1"
          :viewHeight="viewHeight"
          :patientId="patientId"
          @refresh="refresh"
          :showLast="showLast"
        />
      </Scroll>
    </div>
  </div>
</template>
<script>
import { imageList, imageUpload, patientCheckDiseases } from "@/api/hqapi";
import { noCheckList } from "@/api/jzy";
import Setting from "@/setting";
import waterfall from "@/components/waterFall";
export default {
  components: { waterfall },
  props: ["name1", "userId", "disList", "userInfo", "listParams"],
  name: "casemessage",
  data() {
    return {
      url: "",
      viewHeight: 300,
      imgList: [],
      total: 0,
      params: { patient_user_id: "", page: 1, pageSize: 9 },
      patientId: "",
      datas: { type: "chat" },
      uploadParams: {
        id: "",
        img_path: [],
      },
      imgNum: 0,
      currentIndex: 0,
      edit: false,
      btnloading: false,
      showLast: false,
      userList: [],
    };
  },
  methods: {
    handleReachBottom() {
      if (this.total > this.imgList.length) {
        return new Promise((resolve) => {
          this.params.page++;
          this.getData();
          resolve();
        });
      } else if (this.total >= this.params.pageSize) {
        this.showLast = true;
        // this.$Message.warning('到底啦~' )
      }
    },
    refresh() {
      this.showLast = false;
      this.params.page = 1;
      imageList(this.params).then((res) => {
        this.total = res.total;
        this.$emit("getTotal", this.total);
        this.imgList = res.list;
      });
    },
    getData() {
      imageList(this.params).then((res) => {
        this.total = res.total;
        this.$emit("getTotal", this.total);
        this.imgList = this.imgList.concat(res.list);
      });
    },
    askDatas(id) {
      this.params.patient_user_id = id;
      this.patientId = id;
      this.params.page = 1;
      this.refresh();
    },
    beforUpload(e) {
      this.imgNum++;
      this.uploadParams = {
        id: this.patientId,
        img_path: [],
      };
    },
    successUpload(response, file, fileList) {
      this.uploadParams.img_path.push(response.data.path[0]);
      if (this.uploadParams.img_path.length == this.imgNum) {
        imageUpload(this.uploadParams).then((res) => {
          this.refresh();
          this.imgNum = 0;
        });
      }
    },
    handleDis(patientDis) {
      if (this.userList && this.userList.length > 0) {
        this.userList.forEach((item, index) => {
          if (this.userId == item.id) {
            this.currentIndex = index;
          }
        });
        if (this.userList.length == this.currentIndex + 1) {
          this.edit = true;
          this.currentIndex = -1;
        }
      }

      this.btnloading = true;
      let params = {
        patient_user_id: this.userId,
        patient_diseases_id: "",
        patient_diseases_child_id: "",
      };
      this.disList.forEach((ele) => {
        if (ele.value == patientDis) {
          params.patient_diseases_id = patientDis;
        } else {
          ele.children.forEach((child) => {
            if (child.value == patientDis) {
              params.patient_diseases_id = ele.value;
              params.patient_diseases_child_id = patientDis;
            }
          });
        }
      });
      patientCheckDiseases(params)
        .then((res) => {
          if (this.edit) {
            let listParams = this.listParams;
            listParams.page = 1;
            noCheckList(listParams).then((res) => {
              localStorage.setItem("userList", JSON.stringify(res.list.list));
              this.userList = JSON.parse(localStorage.getItem("userList"));
              if (this.userList.length > 0) {
                this.$Message.info("核验成功！");
                this.nextPatient();
              } else {
                this.$Message.warning("这是最后一条喽！");
                this.$emit("closeModal");
              }
            });
          } else {
            this.nextPatient();
          }
          this.$store.commit("admin/account/changeCloseRefresh", true);
          // this.$emit("handleOpen", this.userList[this.currentIndex + 1]);
        })
        .catch(() => {
          // this.btnloading = false;
          this.nextPatient();
        });
    },

    nextPatient() {
      this.btnloading = false;
      this.$emit("handleOpen", this.userList[this.currentIndex + 1]);
      this.askDatas(this.userList[this.currentIndex + 1]["id"]);
    },
    skip() {
      if (this.userList && this.userList.length > 0) {
        this.userList.forEach((item, index) => {
          if (this.userId == item.id) {
            this.currentIndex = index;
          }
        });
        if (this.userList.length == this.currentIndex + 1) {
          this.edit = true;
          this.currentIndex = -1;
        }
      }
      if (this.edit) {
        let listParams = this.listParams;
        listParams.page = 1;
        noCheckList(listParams).then((res) => {
          localStorage.setItem("userList", JSON.stringify(res.list.list));
          this.userList = JSON.parse(localStorage.getItem("userList"));
          if (this.userList.length > 0) {
            this.nextPatient();
          } else {
            this.$Message.warning("这是最后一条喽！");
            this.$emit("closeModal");
          }
        });
      } else {
        this.nextPatient();
      }
    },
  },
  watch: {
    userInfo() {
      this.btnloading =
        this.userInfo.is_show_diseases_check == 2 ? true : false;
    },
  },
  mounted() {
    this.userList = JSON.parse(localStorage.getItem("userList"));
    if (this.listParams && this.userInfo.is_show_diseases_check == 2) {
      this.skip();
    }
    this.btnloading = this.userInfo.is_show_diseases_check == 2 ? true : false;
    this.params.patient_user_id = this.userId;
    this.patientId = this.userId;
    if (this.name1 == "name5") {
      this.refresh();
    }

    this.url = Setting.apiBaseURL + `/v1/upload/images`;
    this.$nextTick(() => {
      this.viewHeight =
        document.documentElement.clientHeight -
        document.querySelector(".ivu-page-header").clientHeight -
        190;
    });
  },
};
</script>
<style scoped></style>
